<template>
<view class="login">
	<view class="">
		返回
	</view>
		<view class="">
			登录/注册
		</view>
		<view class="">
			<input type="text"  v-model='phone'  placeholder="请输入手机号"/>
		</view>
		<view class="">
		<view class="submit"><button @click="tz" :disabled="phone==''?true:false">发送验证码</button></view>
		</view>
		<view class="p">
		<view>点击按钮表示您同意并愿意遵守</view>
		<view> <view>《隐私协议》</view>和 <view>《服务声明》</view></view>
		</view>
		<view class="">
			<span class="line"></span>
			<span id="font">或者</span>
			<span class="line"></span>
		</view>
		<view class="">
			1111
		</view>
		<view class="aaa" @click="miandenglu">
			先逛逛
		</view>
</view>

</template>

<script>
	import {reactive,toRefs,watch} from 'vue';
		import store from '../../store/index.js'
		const http = require('../../utils/http.js') 
	export default {
		setup(){
			let data = reactive({
					hm:'',
								phone:'',
								tz:()=>{
									http({
										url:'/users/login',
										method:'post',
										data:{phone:data.phone}
									}).then((e)=>{
										console.log(e);
										if(e.data.code==200){
											store.commit('yzmset',e.data.yzm)
											store.commit('Setzt',1)
											uni.redirectTo({
												url: './yzm/yzm'
											});
										}else{
											http({
												url:'/users/yzm'
											}).then((e)=>{
												store.commit('yzmset',e.data.yzm)
												store.commit('Setzt',0)
												uni.redirectTo({
													url: './yzm/yzm'
												});
											})
										}
										
									})
								},
				
				miandenglu:()=>{
					uni.switchTab({
						url:'../hydropower/hydropower'
					})
				},
						jshm:(e)=>{
									data.hm=e
								}
			})
			return { ...toRefs(data)}
		}
	}
</script>

<style lang="less">
.login{
  background: #F5F5F9;
  height: 100%;
}
.login>view:first-child{
  color: #1B9EE3;
}
.login>view:nth-child(2){
  text-align: center;
  font-size: 80rpx;
  margin: 50rpx  0;
  font-weight: 800;

}
.login>view:nth-child(3) input{
	 background: #FFFFFF;
	 padding: 20rpx 10rpx;
	 border-top: 1px solid #C8C7CC;
	 border-bottom: 1px solid #C8C7CC;
}
.login>view:nth-child(4) button{
	width: 692rpx;
	 padding: 10rpx;
	 margin: 50rpx 30rpx;
}
.p view{
	text-align: center;
	font-size: 32rpx;
}
.p>view:nth-child(2){
	display: flex;
	margin: 5rpx 0 0 170rpx;
}
.p view:nth-child(2) view{
color: #0099FF;
}
.submit{
	button{
		background-color: #118EE9;
		color: white;
	}
	button[disabled]{
		background-color: white;
		color: black;
	}
}
.login>view:nth-child(6) {
	text-align: center;
	line-height: 30rpx;
	display: flex;
	margin: 150rpx 20rpx 0 20rpx;
}
.login>view:nth-child(6) .line{
	width: 280rpx;
	border-top: 1px solid #E4E4E4;
	margin-top: 35rpx;
	}
.login>view:nth-child(6) #font{
		margin: auto 20rpx;
		color: #CCCCCC;
		border: 1px solid #E4E4E4;
		padding: 20rpx;
		border-radius: 50rpx;
		background: #FFFFFF;
	}
	.login>view:nth-child(8){
		text-align: center;
		}
</style>
